<template>
  <div>
    <el-descriptions title="新增用户" direction="vertical" :column="4" border>
      <el-descriptions-item width="33%" label="姓名">
        <el-input type="text" v-model="data.name"></el-input>
      </el-descriptions-item>

      <el-descriptions-item width="33%" label="账号">
        <el-input type="text" v-model="data.value"></el-input>
      </el-descriptions-item>

      <el-descriptions-item width="34%" label="性别">
        <el-select
          v-model="Gender"
          placeholder="Select"
          size="large"
          style="width: 240px"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-descriptions-item>

      <el-descriptions-item width="34%" label="职务">
        <el-select
          v-model="data.duty"
          placeholder="Select"
          size="large"
          style="width: 240px"
        >
          <el-option
            v-for="item in data.duty"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          />
        </el-select>
      </el-descriptions-item>


      <el-descriptions-item width="50%" label="操作">
        <el-button
          :disabled="data.name.trim() == '' || data.value.trim() == ''"
          type="primary"
          @click="events.add"
        >
          新增
        </el-button>
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

  <script setup lang="ts">
import { Add_User,Get_duty_xla } from "@/api/org/index";
import { close_loading, notice, start_loading } from "@/utils/notice";
import { Customer_Add_Data } from "@/utils/type";
import { inject, reactive, watchEffect } from "vue";
import { ref } from "vue";
const Gender = ref("");
interface Data {
  name: string;
  value: string;
  type: string;
  explain: string;
  Gender: string;
  duty:string
}

const date = reactive<Customer_Add_Data>({
  isFirst: true,
  source_list: [],
  level_list: [],
  duty: [],
  responsibility_list: [],
  request: {
    name: "",
    phone: "",
    wechat: "",
    type: "",
    source: "",
    level: "",
    address: "",
    next_time: "",
    responsibility: "",
    school: "",
    qq: "",
    follow_time: "",
    record: "",
    remark: "",
    author: "",
  },
  type_list: []
});

const data = reactive<Data>({
  name: "",
  value: "",
  type: "",
  explain: "",
  Gender: "",
  duty:""
});

const options = [
  {
    value: "男",
    label: "男",
  },
  {
    value: "女",
    label: "女",
  },
];


const props = defineProps(["data"]);
data.type = props.data;

const emit = defineEmits(["myclose"]);


const methods = {
  async bind() {
      const res = await Get_duty_xla();
      if (res.code === 0) {
       data.duty = res.data.data;
      } else {
        notice(res);
      }
  },
};




const events = {
  async add() {
    start_loading();
    const res = await Add_User({
      name: data.name,
      account: data.value,
      dept: props.data,
      gender: Gender.value,
      duty:data.duty
    });
    notice(res);
    close_loading();
    if (res.code === 0) {
      //通知父组件
      emit("myclose");
    }
  },
};

watchEffect(() => {
  methods.bind();
});
// console.log(props.data.id);

//const aaa = inject("abc");

//console.log(aaa);
</script>

  <style scoped></style>
